JavaScripti asünkroonsed iteraatori abilised: Voogude töötlemine valla päästetud

JavaScript on viimastel aastatel märkimisväärselt arenenud, pakkudes võimsaid tööriistu asünkroonsete andmete käsitlemiseks. Nende tööriistade hulgas paistavad asünkroonsed iteraatorid ja hiljuti ka asünkroonsed iteraatori abilised silma kui tugev lahendus tõhusaks voogude töötlemiseks. See artikkel annab põhjaliku ülevaate asünkroonsetest iteraatori abilistest, uurides nende võimekust, kasutusjuhtumeid ja eeliseid kaasaegses JavaScripti arenduses.

Asünkroonsete iteraatorite mõistmine

Enne asünkroonsete iteraatori abiliste juurde sukeldumist on oluline mõista asünkroonseid iteraatoreid endid. Asünkroonne iteraator on objekt, mis võimaldab teil andmeid asünkroonselt itereerida. Erinevalt tavalistest iteraatoritest, mis tagastavad väärtusi sünkroonselt, tagastavad asünkroonsed iteraatorid lubadusi (promise), mis lahenduvad väärtusteks. See asünkroonne olemus muudab nad ideaalseks ajas saabuvate andmete käsitlemiseks, näiteks võrgupäringutest või failivoogudest.

Siin on asünkroonse iteraatori põhinäide:

            async function* generateSequence(start, end) {
  for (let i = start; i <= end; i++) {
    await new Promise(resolve => setTimeout(resolve, 500)); // Simuleeri viivitust
    yield i;
  }
}

async function main() {
  const asyncIterator = generateSequence(1, 5);

  for await (const value of asyncIterator) {
    console.log(value); // Väljund: 1, 2, 3, 4, 5 (igaühe vahel 500ms viivitus)
  }
}

main();

            

              
                Copy
              
            
          

Selles näites on generateSequence asünkroonse generaatori funktsioon (tähistatud süntaksiga async function*). See väljastab väärtusi asünkroonselt, simuleerides viivitust setTimeout abil. Tsüklit for await...of kasutatakse väärtuste tarbimiseks asünkroonsest iteraatorist.

Asünkroonsete iteraatori abiliste tutvustus

Asünkroonsed iteraatori abilised on meetodid, mis laiendavad asünkroonsete iteraatorite funktsionaalsust, pakkudes mugavamat ja väljendusrikkamat viisi asünkroonsete andmevoogude manipuleerimiseks. Need pakuvad toimingute komplekti, mis sarnaneb massiivimeetoditele nagu map, filter ja reduce, kuid on loodud töötama asünkroonsete iteraatoritega.

Need abilised lihtsustavad oluliselt voogude töötlemise ülesandeid, vähendades korduvat koodi ja parandades koodi loetavust. Need on hetkel ECMAScripti standardimise ettepanekute etapis, kuid on saadaval polüfillide või transpilaatorite nagu Babel kaudu.

Peamised asünkroonsed iteraatori abilised

1. .map(callback)

Abiline .map() teisendab iga väärtuse asünkroonses iteraatoris, rakendades sellele tagasikutsefunktsiooni. Tagasikutsefunktsioon peaks tagastama lubaduse, mis lahendub teisendatud väärtuseks. Abiline .map() tagastab uue asünkroonse iteraatori, mis väljastab teisendatud väärtusi.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 2;
  yield 3;
}

async function main() {
  const numbers = generateNumbers();

  const doubledNumbers = numbers.map(async (number) => {
    await new Promise(resolve => setTimeout(resolve, 200)); // Simuleeri asünkroonset toimingut
    return number * 2;
  });

  for await (const value of doubledNumbers) {
    console.log(value); // Väljund: 2, 4, 6 (igaühe vahel 200ms viivitus)
  }
}

main();

            

              
                Copy
              
            
          

2. .filter(callback)

Abiline .filter() filtreerib väärtusi asünkroonsest iteraatorist tagasikutsefunktsiooni alusel. Tagasikutsefunktsioon peaks tagastama lubaduse, mis lahendub tõeväärtuseks. Kui lubadus lahendub väärtusega true, lisatakse väärtus tulemuseks olevasse asünkroonsesse iteraatorisse; vastasel juhul filtreeritakse see välja.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  yield 5;
}

async function main() {
  const numbers = generateNumbers();

  const evenNumbers = numbers.filter(async (number) => {
    await new Promise(resolve => setTimeout(resolve, 100)); // Simuleeri asünkroonset toimingut
    return number % 2 === 0;
  });

  for await (const value of evenNumbers) {
    console.log(value); // Väljund: 2, 4 (igaühe vahel 100ms viivitus)
  }
}

main();

            

              
                Copy
              
            
          

3. .take(limit)

Abiline .take() võtab asünkroonsest iteraatorist kindlaksmääratud arvu väärtusi. See tagastab uue asünkroonse iteraatori, mis väljastab ainult esimesed limit väärtust.

Näide:

            async function* generateInfiniteSequence() {
  let i = 1;
  while (true) {
    await new Promise(resolve => setTimeout(resolve, 50));
    yield i++;
  }
}

async function main() {
  const infiniteSequence = generateInfiniteSequence();

  const firstFive = infiniteSequence.take(5);

  for await (const value of firstFive) {
    console.log(value); // Väljund: 1, 2, 3, 4, 5 (igaühe vahel 50ms viivitus)
  }

  // Lõputu jada peatatakse pärast 5 väärtuse võtmist.
}

main();

            

              
                Copy
              
            
          

4. .drop(count)

Abiline .drop() jätab asünkroonse iteraatori algusest kindlaksmääratud arvu väärtusi vahele. See tagastab uue asünkroonse iteraatori, mis väljastab väärtusi alates count + 1 elemendist.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  yield 5;
}

async function main() {
  const numbers = generateNumbers();

  const droppedNumbers = numbers.drop(2);

  for await (const value of droppedNumbers) {
    console.log(value); // Väljund: 3, 4, 5
  }
}

main();

            

              
                Copy
              
            
          

5. .reduce(callback, initialValue)

Abiline .reduce() taandab asünkroonse iteraatori ühele väärtusele, rakendades igale väärtusele kumulatiivselt tagasikutsefunktsiooni. Tagasikutsefunktsioon võtab kaks argumenti: akumulaatori ja praeguse väärtuse. See peaks tagastama lubaduse, mis lahendub uuendatud akumulaatoriks. Abiline .reduce() tagastab lubaduse, mis lahendub lõpliku akumulaatori väärtuseks.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  yield 5;
}

async function main() {
  const numbers = generateNumbers();

  const sum = await numbers.reduce(async (accumulator, number) => {
    await new Promise(resolve => setTimeout(resolve, 50)); // Simuleeri asünkroonset toimingut
    return accumulator + number;
  }, 0);

  console.log(sum); // Väljund: 15 (pärast kõiki asünkroonseid toiminguid)
}

main();

            

              
                Copy
              
            
          

6. .toArray()

Abiline .toArray() kogub kõik väärtused asünkroonsest iteraatorist massiivi. See tagastab lubaduse, mis lahendub kõiki väärtusi sisaldavaks massiiviks.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 2;
  yield 3;
}

async function main() {
  const numbers = generateNumbers();

  const numberArray = await numbers.toArray();

  console.log(numberArray); // Väljund: [1, 2, 3]
}

main();

            

              
                Copy
              
            
          

7. .forEach(callback)

Abiline `.forEach()` käivitab etteantud funktsiooni üks kord iga asünkroonse iteraatori elemendi kohta. Funktsioon ei muuda iteraatorit; seda kasutatakse kõrvalmõjude jaoks.

Näide:

            async function* generateGreetings() {
  yield "Hello";
  yield "Bonjour";
  yield "Hola";
}

async function main() {
  const greetings = generateGreetings();

  await greetings.forEach(async (greeting) => {
    await new Promise(resolve => setTimeout(resolve, 50)); // Simuleeri asünkroonset toimingut
    console.log(`Greeting: ${greeting}`);
  });

  // Väljund (kergete viivitustega):
  // Tervitus: Hello
  // Tervitus: Bonjour
  // Tervitus: Hola
}

main();

            

              
                Copy
              
            
          

8. .some(callback)

Abiline `.some()` kontrollib, kas vähemalt üks element asünkroonses iteraatoris läbib etteantud funktsiooniga rakendatud testi. See tagastab lubaduse, mis lahendub väärtusega `true`, kui leitakse element, mille puhul tagasikutsefunktsioon tagastab `true`; vastasel juhul tagastab see `false`.

Näide:

            async function* generateNumbers() {
  yield 1;
  yield 3;
  yield 5;
  yield 8;
  yield 9;
}

async function main() {
  const numbers = generateNumbers();

  const hasEvenNumber = await numbers.some(async (number) => {
    return number % 2 === 0;
  });

  console.log(`Has even number: ${hasEvenNumber}`); // Väljund: On paarisarv: true
}

main();

            

              
                Copy
              
            
          

9. .every(callback)

Abiline `.every()` kontrollib, kas kõik elemendid asünkroonses iteraatoris läbivad etteantud funktsiooniga rakendatud testi. See tagastab lubaduse, mis lahendub väärtusega `true`, kui tagasikutsefunktsioon tagastab tõese väärtuse iga elemendi kohta; vastasel juhul tagastatakse `false`.

Näide:

            async function* generateNumbers() {
  yield 2;
  yield 4;
  yield 6;
  yield 8;
  yield 10;
}

async function main() {
  const numbers = generateNumbers();

  const allEven = await numbers.every(async (number) => {
    return number % 2 === 0;
  });

  console.log(`All even: ${allEven}`); // Väljund: Kõik paarisarvud: true
}

main();

            

              
                Copy
              
            
          

Asünkroonsete iteraatori abiliste kasutusjuhud

Asünkroonsed iteraatori abilised on eriti kasulikud stsenaariumides, kus on vaja tõhusalt töödelda asünkroonseid andmevooge. Siin on mõned levinumad kasutusjuhud:

• Reaalajas andmetöötlus: Andmete töötlemine reaalajas allikatest nagu andurivood või aktsiatähised.
• Võrgupäringud: Andmete käsitlemine lehekülgedeks jaotatud API otspunktidest.
• Failivood: Suurte failide töötlemine rida-realt ilma kogu faili mällu laadimata.
• Andmete teisendamine: Andmete teisendamine ühest vormingust teise, näiteks JSON-i teisendamine CSV-ks.
• Sündmuste käsitlemine: Sündmuste töötlemine asünkroonsetest sündmuste allikatest.

Näide: Andmete töötlemine lehekülgedeks jaotatud API-st

Kujutage ette API-d, mis tagastab andmeid lehekülgedeks jaotatud kujul. Saate kasutada asünkroonseid iteraatori abilisi, et tõhusalt hankida ja töödelda kõiki andmeid kõikidelt lehekülgedelt.

            async function* fetchPaginatedData(url) {
  let page = 1;
  while (true) {
    const response = await fetch(`${url}?page=${page}`);
    const data = await response.json();

    if (data.length === 0) {
      break; // Rohkem andmeid pole
    }

    for (const item of data) {
      yield item;
    }

    page++;
  }
}

async function main() {
  const apiUrl = 'https://api.example.com/data'; // Asenda oma API otspunktiga
  const allData = fetchPaginatedData(apiUrl);

  const processedData = allData
    .filter(async (item) => item.isValid)
    .map(async (item) => ({ ...item, processed: true }));

  for await (const item of processedData) {
    console.log(item);
  }
}

main();

            

              
                Copy
              
            
          

See näide demonstreerib, kuidas saate kasutada abilisi .filter() ja .map(), et töödelda andmeid lehekülgedeks jaotatud API otspunktist. Funktsioon fetchPaginatedData hangib andmeid igalt leheküljelt ja väljastab üksikuid elemente. Abiline .filter() filtreerib välja kehtetud elemendid ja abiline .map() lisab igale elemendile lipu processed.

Asünkroonsete iteraatori abiliste eelised

• Parem koodi loetavus: Asünkroonsed iteraatori abilised pakuvad deklaratiivsemat ja väljendusrikkamat viisi asünkroonsete andmevoogude töötlemiseks, muutes teie koodi lihtsamini mõistetavaks ja hooldatavaks.
• Vähendatud korduv kood: Need vähendavad tavaliste voogude töötlemise ülesannete jaoks vajaliku korduva koodi hulka, võimaldades teil keskenduda oma rakenduse põhilogikale.
• Tõhus voogude töötlemine: Need on loodud töötama tõhusalt asünkroonsete andmevoogudega, minimeerides mälukasutust ja parandades jõudlust.
• Kompositsioonivõimalus: Asünkroonseid iteraatori abilisi saab aheldada, et luua keerukaid voogude töötlemise torujuhtmeid.
• Vigade käsitlemine: Asünkroonsete iteraatorite ja abiliste asünkroonne olemus võimaldab tugevat vigade käsitlemist, kasutades try...catch plokke.

Võrdlus alternatiivsete lähenemistega

Enne asünkroonseid iteraatori abilisi tuginesid arendajad voogude töötlemiseks sageli teistele lähenemistele, näiteks:

• Tagasikutsed (Callbacks): Tagasikutsed võivad viia tagasikutsete põrgusse (callback hell) ja muuta koodi raskesti loetavaks ning hooldatavaks.
• Lubadused (Promises): Lubadused pakuvad struktureeritumat viisi asünkroonsete toimingute käsitlemiseks, kuid need võivad siiski olla keerukate voogude töötlemise ülesannete jaoks liiga sõnarohked.
• RxJS: RxJS (Reactive Extensions for JavaScript) on võimas teek reaktiivseks programmeerimiseks, kuid see võib olla liiga suur ja keeruline lihtsate voogude töötlemise stsenaariumide jaoks.

Asünkroonsed iteraatori abilised pakuvad neile lähenemistele kergemat ja intuitiivsemat alternatiivi, pakkudes tasakaalu väljendusrikkuse ja lihtsuse vahel.

Polüfillimine ja brauseri tugi

Kuna asünkroonsed iteraatori abilised on endiselt ettepanekute etapis, ei toeta kõik brauserid ja JavaScripti keskkonnad neid veel algupäraselt. Siiski saate neid oma projektides juba täna kasutada polüfillide või transpilaatorite nagu Babel abil.

Et kasutada asünkroonseid iteraatori abilisi koos Babeliga, peate installima pistikprogrammi @babel/plugin-proposal-async-iterator-helpers ja konfigureerima Babeli seda kasutama.

Alternatiivina võite kasutada polüfillide teeki, mis pakub asünkroonsete iteraatori abiliste implementatsioone. Valige kindlasti mainekas ja hästi hooldatud polüfillide teek.

Praktilised näited: Globaalsed andmetöötluse stsenaariumid

Uurime mõningaid praktilisi näiteid, kuidas asünkroonseid iteraatori abilisi saab rakendada globaalsetes andmetöötluse stsenaariumides:

1. Valuutavahetuskursside töötlemine

Kujutage ette, et peate töötlema erinevatest allikatest pärit valuutavahetuskursside voogu ja arvutama ekvivalentse summa sihtvaluutas. Saate kasutada asünkroonseid iteraatori abilisi, et andmeid tõhusalt töödelda ja arvutusi teha.

            async function* fetchCurrencyRates() {
  // Simuleeri valuutakursside hankimist mitmest allikast
  yield { from: 'USD', to: 'EUR', rate: 0.85 };
  yield { from: 'USD', to: 'JPY', rate: 110.00 };
  yield { from: 'EUR', to: 'GBP', rate: 0.90 };
}

async function main() {
  const currencyRates = fetchCurrencyRates();

  const convertedAmounts = currencyRates.map(async (rate) => {
    const amountInUSD = 100; // Näidissumma USD-s
    let convertedAmount;

    if (rate.from === 'USD') {
      convertedAmount = amountInUSD * rate.rate;
    } else {
      // Hangi 'from' valuuta USD kurss ja arvuta konversioon
      // (Lihtsustatud demonstreerimise eesmärgil)
      convertedAmount = amountInUSD * rate.rate * 1.17;
    }

    return { ...rate, convertedAmount };
  });

  for await (const rate of convertedAmounts) {
    console.log(rate);
  }
}

main();

            

              
                Copy
              
            
          

2. Globaalsete sotsiaalmeedia trendide analüüsimine

Saate kasutada asünkroonseid iteraatori abilisi, et analüüsida trende erinevatelt sotsiaalmeedia platvormidelt üle maailma. Saate filtreerida andmeid keele, piirkonna või teema järgi ja seejärel koondada tulemused globaalsete trendide tuvastamiseks.

            async function* fetchSocialMediaData() {
  // Simuleeri sotsiaalmeedia andmete hankimist mitmest allikast
  yield { platform: 'Twitter', language: 'en', region: 'US', topic: 'JavaScript', count: 150 };
  yield { platform: 'Twitter', language: 'es', region: 'ES', topic: 'JavaScript', count: 80 };
  yield { platform: 'Weibo', language: 'zh', region: 'CN', topic: 'JavaScript', count: 200 };
}

async function main() {
  const socialMediaData = fetchSocialMediaData();

  const javascriptTrends = socialMediaData
    .filter(async (data) => data.topic === 'JavaScript')
    .reduce(async (accumulator, data) => {
      accumulator[data.region] = (accumulator[data.region] || 0) + data.count;
      return accumulator;
    }, {});

  const trends = await javascriptTrends;
  console.log(trends);
}

main();

            

              
                Copy
              
            
          

Parimad praktikad asünkroonsete iteraatori abiliste kasutamiseks

• Kasutage kirjeldavaid muutujate nimesid: Kasutage kirjeldavaid muutujate nimesid, et muuta oma koodi lihtsamini mõistetavaks.
• Käsitsege vigu sujuvalt: Kasutage try...catch plokke vigade käsitlemiseks ja rakenduse kokkujooksmise vältimiseks.
• Arvestage jõudlusega: Olge teadlik asünkroonsete iteraatori abiliste kasutamise jõudlusmõjudest, eriti suurte andmevoogude töötlemisel.
• Polüfillige või transpaleerige: Veenduge, et polüfillite või transpileerite oma koodi, et toetada vanemaid brausereid ja JavaScripti keskkondi.
• Testige oma koodi põhjalikult: Testige oma koodi põhjalikult, et veenduda selle korrektses toimimises ja erijuhtumite käsitlemises.

Kokkuvõte

Asünkroonsed iteraatori abilised on võimas tööriist tõhusaks voogude töötlemiseks JavaScriptis. Need pakuvad mugavamat ja väljendusrikkamat viisi asünkroonsete andmevoogude manipuleerimiseks, vähendades korduvat koodi ja parandades koodi loetavust. Mõistes ja rakendades asünkroonseid iteraatori abilisi, saate ehitada vastupidavamaid ja skaleeritavamaid rakendusi, mis käsitlevad asünkroonseid andmeid tõhusalt. Kuna need liiguvad standardimise suunas, muutub asünkroonsete iteraatori abiliste omaksvõtmine kaasaegsete JavaScripti arendajate jaoks üha väärtuslikumaks.

Võtke omaks asünkroonsete iteraatorite ja abiliste võimsus, et avada uusi võimalusi oma JavaScripti rakendustes! Alates reaalajas andmete töötlemisest kuni globaalsete trendide analüüsimiseni pakuvad need tööriistad aluse reageerivate ja tõhusate süsteemide ehitamiseks.